import React from 'react';
import "./index.scss";
import { ForbiddenIcon, PageNotFoundIcon, ServiceErrorIcon } from '@/components/icons';
import { Button } from 'antd';
import { useLocation, useNavigate } from 'react-router-dom';

const Errors: React.FC = () => {
    const navigate = useNavigate();
    const homePath = import.meta.env.VITE_HOME_PATH;
    const location = useLocation();
    const errorTypes = location.pathname.includes("404") || location.pathname.toLocaleLowerCase().includes("notfound")
        ? "404"
        : location.pathname.includes("403")
            ? "403"
            : "500";

    return (
        <div className='content'>
            <div className='error-page'>
                {errorTypes === '404' ? <PageNotFoundIcon /> : errorTypes === "500" ? <ServiceErrorIcon /> : <ForbiddenIcon />}
                {errorTypes === '404' && <p className='title'>NOT FOUND</p>}
                <Button style={{ marginTop: 16 }} onClick={() => navigate(homePath)} type="primary">返回首页</Button>
            </div>
        </div>
    );
};

export default Errors;
